const { VueLoaderPlugin } = require('vue-loader')
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
  mode: process.env.NODE_ENV,
  target: 'web',
  entry: './src/main.js',
  module: {
    rules: [
      {
        test: /.vue$/,
        loader: 'vue-loader'
      },
      {
        test: /.js$/,
        exclude: /node-modules/,
        loader: 'babel-loader'
      },
      {
        test: /.less$/,
        use: [
          'style-loader',
          'css-loader',
          'less-loader'
        ]
      },
      {
        test: /.css$/,
        use: [
          'style-loader',
          'css-loader',
        ]
      },
      {
        test: /.(png|jpe?g|svg|gif)$/,
        loader: 'url-loader',
        options: {
          limit: 1024 * 2,
          name: '[name].[hash:8].[ext]',
          outputPath: 'images',
          esModule: false
        }
      },
      {
        exclude: /\.(css|less|png|jpe?g|gif|html|js|vue)$/,
        loader: 'file-loader'
      }
    ]
  },
  plugins: [
    new VueLoaderPlugin(),
    new HtmlWebpackPlugin({
      template: './public/index.html',
      templateParameters: {
        BASE_URL: process.env.NODE_ENV === 'development' ? '/' : './'
      },
      minify: {
        removeComments: true,
        collapseWhitespace: true
      }
    })
  ]
}